<template>
  <view>
    <view class="mt-2 mb-2 c-text-14">设备信息</view>
    <van-cell-group inset>
      <van-cell title="设备编号" :value="equipInfo.equipCode"></van-cell>
      <van-cell title="设备MAC" :value="equipInfo.equipMac"></van-cell>
      <van-cell title="设备电话号" :value="equipInfo.equipPhone || '无'"></van-cell>
      <!--      <van-cell title="使用人：" use-label-slot>
        <view slot="right-icon" @click="showSetEquipPopup('owner', equipInfo.actualUserId)">
          <text class="mr-1">{{ actualUserName }}</text>
          <i class="i-lucide:edit"></i>
        </view>
      </van-cell>-->

      <van-cell title="实际使用人" is-link :value="actualUserName || '未设置'" @click="showSetEquipPopup('owner', equipInfo.actualUserId)"></van-cell>

      <!--      <van-cell title="在线状态：" use-label-slot>
        <view slot="right-icon">
          <van-tag v-if="data.equipState === 2" type="success">在线</van-tag>
          <van-tag v-else type="danger">离线</van-tag>
        </view>
      </van-cell>
      <van-cell title="报警状态：" use-label-slot>
        <view slot="right-icon">
          <van-tag v-if="data.errorState === 0" type="success">正常</van-tag>
          <van-tag v-else type="danger">异常</van-tag>
        </view>
      </van-cell>-->
      <van-cell title="激活日期" :value="equipInfo.equipPhone || ''"></van-cell>
      <!--      <van-cell title="流量截止日期：" use-label-slot>
        <view slot="right-icon">
          <text>{{ data.flowEndDate || '' }}</text>
        </view>
      </van-cell>-->
    </van-cell-group>

    <SetEquipInfoPopup :equip-id="equipInfo.equipId" :type="setInfo.type" :content="setInfo.content" @change-value="handleChangeValue" />
  </view>
</template>

<script setup lang="ts">
import SetEquipInfoPopup from '@/subcontract/equipment/equipDetail/component/SetEquipInfoPopup.vue';
import { useControllerStore } from '@/store';

interface ISetInfo {
  type: string;
  content: any;
}

const props = defineProps<{ equipInfo: IEquipDetailRes }>();
const actualUserName = ref<string>('');
const setInfo = reactive<ISetInfo>({ type: '', content: '' });

onMounted(() => {
  actualUserName.value = props.equipInfo.actualUserName;
});

const showSetEquipPopup = (type: string, content: any) => {
  setInfo.type = type;
  setInfo.content = content;
  useControllerStore().$patch({ setEquipInfoPopup: true });
};

const handleChangeValue = (payload: { type: string; content: any }) => {
  switch (payload.type) {
    case 'owner':
      actualUserName.value = payload.content;
      break;
  }
};
</script>
